<div id="myCarousel" data-ride="carousel" data-interval="1200" class="carousel slide carousel-fade">
<ol class="carousel-indicators">
<?php $dotall=count($banners);for($i=0;$i<$dotall;$i++){?>
    <li data-target="#myCarousel" data-slide-to="<?php echo $i ?>" <?php echo $i==0?'class="active"':"";?>></li>
<?php }?>
  </ol>   
  <div class="carousel-inner">
 <?php $count=0;foreach ($banners as $banner) { ?>
  <div class="item <?php echo $count==0?"active":"";?>">
    <?php if ($banner['link']) { ?>
    <a href="<?php echo $banner['link']; ?>"><img src="<?php echo $banner['image']; ?>" alt="<?php echo $banner['title']; ?>" class="img-responsive" /></a>
    <?php } else { ?>
    <img src="<?php echo $banner['image']; ?>" alt="<?php echo $banner['title']; ?>" class="img-responsive" />
    <?php } ?>
  </div>
  <?php $count++;} ?>
  </div>
  <a href="#myCarousel" class="left carousel-control" data-slide="prev">
    <!-- 箭头图片 -->
    <span class="arrow pre">&nbsp;</span>
  </a>
  <a href="#myCarousel" class="right carousel-control" data-slide="next">
    <!-- 箭头图片 -->
    <span class="arrow"></span>
  </a>
  <style type="text/css">
.carousel-control{
background-image:none!important;
}
.arrow{
      display: block;
      margin-top: -15px;
    width: 32px;
    height: 32px;
    position: absolute;
    top: 50%;
    right: 50%;
    overflow: hidden;
    background: rgba(0,0,0,.2) no-repeat 50% 50%;
    background-image: url('');
    background-size: 7px 11px;
    border-radius: 32px;
    text-indent: -999em;
    opacity: .6;
    transition: opacity .2s;
}
.arrow.pre {
      left: 50%;
      right: auto;
      -ms-transform: rotate(-180deg);
      transform: rotate(-180deg);
    }
  </style>
</div>